<template>
  <view class="whe_maxv" style="background-color: #f8faf7">
    <view class="sy_bg czjz_flex" style="height: 150px">
      <view class="wh_max">
        <view class="wh_f pad_10 boxs">
          <view class="flex_1 wh_f">
            <view style="padding-right: 10px">
              <image class="" src="../../static/img/userImg.png" style="width: 80px;height: 80px"/>
            </view>
            <view class="flex_1">
              <view class="fz_20 mag_t-10">张三</view>
              <view class="pad_t-10 centerdq">
                <view class="fz_10 bor_5 disp" style="color: #ff7802;padding: 2px 4px;background-color: #9cdc99;border: #ffd166 1px solid">
                  <image src="../img/hy.png" style="width: 10px;height: 10px"></image>
                  <text class="mag_l-5">共富一级</text>
                </view>
              </view>
            </view>
          </view>
          <view>
            <view class="wz_lv"><text class="fz_30 em">168</text> 分</view>
            <view class="fz_12 wz_hui">个人富治积分</view>
          </view>
        </view>
      </view>
    </view>


    <view class="boxs" style="padding: 0 20px 20px">
      <view style="font-size: 0">
        <img src="../../static/img/tab_t.png" style="width: 100%;height: 20px"/>
      </view>
      <view class="pad">
        <view class="fz_18 em">
          积分明细
        </view>
        <view class="wz_hui fz_12 pad_10_0">
          网格长全域秀美积分打三折
        </view>
        <view class="wh_f mag_t-10">
          <view class="flex_1">
            <view class="img_bg" style="height: 120px">
              <view class="pad_15 boxs">
                <view style="color: #ff9a2e">
                  <text class="fz_26 em">103 </text> 分钟
                </view>
                <view class="fz_12 pad_b_15" style="color: #525252">善治积分</view>
                <view class="fz_12">
                  <text style="border-radius: 25px;padding: 5px 7px;color: #ff9a2e;background-color: #ffebd5">查看详情 》</text>
                </view>
              </view>
              <image src="../img/szjf.png" alt="" />
            </view>
          </view>
          <view style="width:5px"></view>
          <view class="flex_1">
            <view class="img_bg" style="height: 120px">
              <view class="pad_15 boxs">
                <view class=" wz_lv">
                  <text class="fz_26 em">86 </text> 分
                </view>
                <view class="fz_12 pad_b_15" style="color: #525252">志愿者信用时长</view>
                <view class="fz_12">
                  <text style="border-radius: 25px;padding: 5px 7px;color: #3a9e5f;background-color: #d5f0dd">查看详情 》</text>
                </view>
              </view>
              <image src="../img/szjf.png" alt="" />
            </view>
          </view>
        </view>
        <view class="wh_f mag_t-10">
          <view class="flex_1">
            <view class="img_bg" style="height: 120px">
              <view class="pad_15 boxs">
                <view style="color: #d3205f">
                  <text class="fz_26 em">112 </text> 小时
                </view>
                <view class="fz_12 pad_b_15" style="color: #525252">志愿者信用时数（公益益币）</view>
                <view class="fz_12">
                  <text style="border-radius: 25px;padding: 5px 7px;color: #d3205f;background-color: #f6d2df">查看详情 》</text>
                </view>
              </view>
              <image src="../img/zyzxyss.png" alt="" />
            </view>
          </view>
          <view style="width:5px"></view>
          <view class="flex_1">
            <view class="img_bg" style="height: 120px">
              <view class="pad_15 boxs">
                <view style="color: #2a5caa">
                  <text class="fz_26 em">93 </text> 分
                </view>
                <view class="fz_12 pad_b_15" style="color: #525252">人才积分</view>
                <view class="fz_12">
                  <text style="border-radius: 25px;padding: 5px 7px;color: #2a5caa;background-color: #d4deee">查看详情 》</text>
                </view>
              </view>
              <image src="../img/rcjf.png" alt="" />
            </view>
          </view>
        </view>
    </view>

    <view class="fz_18 em pad_10_0">
        等级兑换
    </view>

    <view clsss="fz_18 xyy" style="border-radius: 10px;padding:0 10px;background-color: white">
        <view class="wh_f bor_b_hui pad_10_0">
          <view class="flex_1">
            <image class="centerdq" src="../img/djdh.png" style="width: 30px;height: 30px"/>
            <text class="centerdq" style="margin: 0 10px">等级兑换</text>
          </view>
          <view class="wz_lv em">
            <text>267分</text>
            <image class="centerdq mag_l-20" src="../../static/icon/right.png" style="width: 6px;height: 12px"></image>
          </view>
        </view>
        <view class="wh_f bor_b_hui pad_10_0">
          <view class="flex_1">
            <image class="centerdq" src="../img/qdlb.png" style="width: 30px;height: 30px"/>
            <text class="centerdq" style="margin: 0 10px">签到礼包</text>
          </view>
          <view class="wz_lv em">
            <text>267分</text>
            <image class="centerdq mag_l-20" src="../../static/icon/right.png" style="width: 6px;height: 12px"></image>
          </view>
        </view>
        <view class="wh_f bor_b_hui pad_10_0">
          <view class="flex_1">
            <image class="centerdq" src="../img/czzs.png" style="width: 30px;height: 30px"/>
            <text class="centerdq" style="margin: 0 10px">充值赠送</text>
          </view>
          <view class="wz_lv em">
            <text>267分</text>
            <image class="centerdq mag_l-20" src="../../static/icon/right.png" style="width: 6px;height: 12px"></image>
          </view>
        </view>
      <view class="wh_f pad_10_0">
        <view class="flex_1">
          <image class="centerdq" src="../img/bqkc.png" style="width: 30px;height: 30px"/>
          <text class="centerdq" style="margin: 0 10px">补签扣除</text>
        </view>
        <view class="wz_lv em">
          <text>267分</text>
          <image class="centerdq mag_l-20" src="../../static/icon/right.png" style="width: 6px;height: 12px"></image>
        </view>
      </view>
      </view>
  </view>
  </view>
</template>
<script>
export default {
  name: "index"
}
</script>
<style scoped lang="scss">

</style>
